<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>ajax</title>
	<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
	<script src="./js/request.js"></script>
</head>
<body>
	<form action="" id="form_login">
		用户名<input type="text" name="username">
		密码<input type="password" name="password">
		<input type="submit" value="登录">
	</form>
	<!-- 加载 -->
		<button id="btn_load">加载用户信息</button>
	<div id="msg">
		
	</div>

	<script type="text/javascript">
		var token;	//token全局
		var form_login = document.querySelector("#form_login");
		var msg = document.querySelector("#msg");
		var btn_load = document.querySelector("#btn_load")
		btn_load.onclick = function(){
			//准备参数
			var param = {
				page:1,
				pageSize:10
			}
			let url = "http://localhost:7788/baseUser/pageQuery?"+$.param(param)
			request.ajax("GET",url,{Authorization:token},null,function(resp){
				msg.innerText = resp.data.list
			})
			
		}
		//提交登录
		form_login.onsubmit = function(event){
			// alert(1);
			//获取表单数据
			var username = document.querySelector("#form_login > input[name=username]").value;
			var password = document.querySelector("#form_login > input[name=password]").value;
			// alert(username+":"+password)
			let url = "http://localhost:7788/user/login"
			var data = JSON.stringify({username,password});
			request.ajax("POST",url,
				{
					"Content-Type":"application/json"
				},data,function(resp){
					token = resp.data.token;
					msg.innerText = "登录成功"
				});
			
			event.preventDefault();
			
		}
	</script>
</body>
</html>